import { addClassify, ClassifyApi } from '@/api/premium/category/classify'
import {
  AddClassifyReq,
  AtlasScope,
  ClassifyShow,
  ClassifyType,
} from '@/api/premium/category/model/classifyModel'
import { useStore } from '@/store'
import { computed, reactive } from '@vue/runtime-core'
import { message } from 'ant-design-vue'
import { AddClassifyDiaState } from '../type'

const useAddAtlasCDialog = (searchApi: AsyncFun) => {
  const store = useStore()
  const addAtlasCDialogState = reactive<AddClassifyDiaState>({
    visiable: false,
    formData: {
      parentId: '',
      name: '',
      scope: AtlasScope.THEME,
      redirectUrl: '',
      banner: '',
      image: '',
      isShow: ClassifyShow.SHOW,
    },
  })

  const openAddAtlasCDia = (pId = '0') => {
    addAtlasCDialogState.formData.parentId = pId
    addAtlasCDialogState.visiable = true
  }
  const enterAddAtlasC = async () => {
    const reqData: AddClassifyReq = {
      ...addAtlasCDialogState.formData,
      type: ClassifyType.ATLAS,
    }
    await addClassify(reqData)
    message.success('新增成功！')
    addAtlasCDialogState.visiable = false
    await searchApi()
  }
  const addClassifyLoading = computed(() =>
    store.getters['global/isOpLoading'](ClassifyApi.ADD_CLASSIFY)
  )

  return {
    addAtlasCDialogState,
    openAddAtlasCDia,
    enterAddAtlasC,
    addClassifyLoading,
  }
}

export default useAddAtlasCDialog
